<template>
	<view class="left clearfix detail-box">
		<view style="font-size:16px;padding:15px;background: #fff;">
			<uni-breadcrumb separator="/">
				<uni-breadcrumb-item v-for="(route,index) in routes" :key="index" :to="route.to">
					{{route.name}}
				</uni-breadcrumb-item>
			</uni-breadcrumb>
		</view>
		<view class="detail-content left clearfix">
<!--			*-*-*-*-*-*-*-		用户信息 		*-*-*-*-*-*-*-					-->
			<uni-table border :loading="!loading" stripe emptyText="暂无更多数据"  style="border:1px solid #ccc;min-height:200px;margin:10rpx 0" >
				<uni-tr>
					<uni-th align="center" style="width:200px;" colspan="1" >
						<text>用户信息 	</text>
					</uni-th>
					<uni-td>
						<!-- <uni-tooltip content="编辑用户数据" style="width: 100px;text-align: left;padding:10rpx">
												  <uni-icons type="compose" @click="goUrl(`/pages/system/user/edit?id=${data.create_uid[0]._id}`)" style="color:#adadad;"  size="25"></uni-icons>
						</uni-tooltip> -->
						<navigator :url="`/pages/system/user/list?_uid=${data.create_uid[0]._id}`">
							<text class="titleApp">
								#
							</text>
						</navigator>
					</uni-td>
					
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 用户名称 </uni-th>
					<uni-td>
						{{data.create_uid[0].nickname}}
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 用户名 </uni-th>
					<uni-td>
						{{data.create_uid[0].username}}
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 手机号 </uni-th>
					<uni-td>
						<view class="TelApp" >
							{{initalMobile(data.create_uid[0].mobile )}}
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 手机系统 </uni-th>
					<uni-td>
						<view >
							{{ data.create_uid[0].register_env.os_name  }}
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 平台版本 </uni-th>
					<uni-td>
						v {{data.create_uid[0].register_env.app_version}}
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 最近登录IP </uni-th>
					<uni-td>
						{{data.create_uid[0].last_login_ip}}
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 最新登录时间 </uni-th>
					<uni-td>
						<uni-dateformat :date="data.create_uid[0].last_login_date" />
					</uni-td>
				</uni-tr>
			</uni-table>
<!--			*-*-*-*-*-*-*-		商铺信息 		*-*-*-*-*-*-*-					-->
			<uni-table border stripe emptyText="暂无更多数据"  style="border:1px solid #ccc;min-height:200px;margin:50px 0" >
				<uni-tr>
					<uni-th align="center" style="width:200px;" colspan="1" > 
						<view>
							商铺信息
						</view>
						<!-- <uni-tooltip content="编辑商铺数据" style="width: 100px;text-align: left;padding:10rpx">
							<uni-icons type="compose" @click="goUrl(`/pages/shop/shop/edit?id=${data._id._value}`)" style="color:#adadad;"  size="25"></uni-icons>
						</uni-tooltip> -->
					</uni-th>
					<uni-td>
						<navigator :url="`/pages/shop/shop/list?_uid=${data._id._value}`">
							<view class="titleApp" >
								#
							</view>
						</navigator>
					</uni-td>
				</uni-tr>
				
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商铺logo </uni-th>
					<uni-td>
						<image v-if="data.logo.url" :src="data.logo.url+'?x-oss-process=image/resize,m_fixed,h_100,w_100'" mode="widthFix" style="width:70rpx;" ></image>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 分类归属 </uni-th>
					<uni-td>
						<text class=" ">
							{{getCategirster(data.categories) }}
						</text>
						<text>
							{{categirster}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商铺名称 </uni-th>
					<uni-td>
						{{data.title}}
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商铺联系方式 </uni-th>
					<uni-td>
						<text class="TelApp">
							{{initalMobile(data.tel  )}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商铺住址 </uni-th>
					<uni-td>
						<text class="">
							{{snaYuanIs(data.address) }}-{{snaYuanIs(data.poiname ) }}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 营业时间 </uni-th>
					<uni-td>
						<text class="">
							{{ initaTime(data.start_business_hours1) }}-{{initaTime(data.end_business_hours1 ) }}
						</text>
						<view v-if="data.start_business_hours2">
							{{initaTime(data.start_business_hours2)}}-{{initaTime(data.end_business_hours2 )}}
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 店铺余额 </uni-th>
					<uni-td>
						<text class="fontColorApp" >
							￥{{(data.money < 0 ? 0 :data.money/100).toFixed(2)}}
						</text>
					</uni-td>
				</uni-tr>
				
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 可提现余额 </uni-th>
					<uni-td>
						<text class="fontColorApp" >
							￥{{(data.withdrawable_money ?  data.withdrawable_money/100 :0   ).toFixed(2)}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商品数量 </uni-th>
					<uni-td>
						<text class="fontColorApp">
							{{data.goods}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 简介/公告 </uni-th>
					<uni-td>
						<text class=" ">
							{{data.intro}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 经营状态 </uni-th>
					<uni-td>
						<text class=" ">
							{{data.disabled_status?'✅':'❎'}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商铺状态 </uni-th>
					<uni-td>
						<text class=" ">
							{{data.business_status?'✅':'❎'}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 免配送费 </uni-th>
					<uni-td>
						<text class="fontColorApp" >
							￥{{(data.delivery_price ?  data.delivery_price/100 :0   ).toFixed(2)}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 店起送费 </uni-th>
					<uni-td>
						<text class=" ">
							<text class="fontColorApp" >
								￥{{(data.start_delivery_price ?  data.start_delivery_price/100 :0   ).toFixed(2)}}
							</text>
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr v-if="data.preferential" >
					<uni-th align="center" style="width:200px;"  > 满减优惠 </uni-th>
					<uni-td>
						<view class="" v-for="(item,index) in data.preferential" >
							<text>
								满{{item.full}}减{{item.reduce}}
							</text>
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 创建时间 </uni-th>
					<uni-td>
						<uni-dateformat :date="data.create_time"></uni-dateformat>
					</uni-td>
				</uni-tr>
				
			</uni-table>
<!--			*-*-*-*-*-*-*-		商铺营业资质 		*-*-*-*-*-*-*-					-->
			<uni-table  border stripe emptyText="暂无更多数据"  style="border:1px solid #ccc;min-height:200px;margin:10rpx 0" >
				<uni-tr>
					<uni-th align="center" style="width:200px;" colspan="1" > 
						<view>
							营业资质
						</view>
					</uni-th>
					<uni-td>
						<navigator  v-if="userHasPermission(['admin'])" :url="`/pages/shop/shop/edit-authentication?_uid=${data._id.shop_authentication[0]._id}`">
							<view class="titleApp" >
								#
							</view>
						</navigator>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商铺负责人 </uni-th>
					<uni-td>
						{{snaYuanIs(data._id.shop_authentication[0].legal_person_name) }}
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 负责人身份证件号 </uni-th>
					<uni-td>
						<text class="TelApp">
							{{initaCards(data._id.shop_authentication[0].legal_person_card)  }}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 统一社会信用代码 </uni-th>
					<uni-td>
						<text class="TelApp">
							{{initaCards(data._id.shop_authentication[0].business_license_number)}}
						</text>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-th align="center" style="width:200px;"  > 商铺经营场所 </uni-th>
					<uni-td>
						{{data._id.shop_authentication[0].business_license_address}}
					</uni-td>
				</uni-tr>
				<uni-tr  >
					<uni-th align="center" style="width:200px;"  > 开户人卡证-正 </uni-th>
					<uni-td>
						<image  @click="eventImage(data._id.shop_authentication[0].legal_person_card_photo_z.url)" v-if="data._id.shop_authentication[0].legal_person_card_photo_f" :src="data._id.shop_authentication[0].legal_person_card_photo_z.url+'?x-oss-process=image/resize,m_fixed,h_100,w_100'" mode="widthFix" style="width:200rpx;" ></image>
					</uni-td>
				</uni-tr>
				
				<uni-tr >
					<uni-th align="center" style="width:200px;"  > 开户人卡证-反 </uni-th>
					<uni-td>
						<image  @click="eventImage(data._id.shop_authentication[0].legal_person_card_photo_f.url)" v-if="data._id.shop_authentication[0].legal_person_card_photo_f" :src="data._id.shop_authentication[0].legal_person_card_photo_f.url+'?x-oss-process=image/resize,m_fixed,h_100,w_100'" mode="widthFix" style="width:200rpx;" ></image>
					</uni-td>
				</uni-tr>
				
				<uni-tr   >
					<uni-th align="center" style="width:200px;"  >许可证  </uni-th>
					<uni-td>
						<image  @click="eventImage(data._id.shop_authentication[0].permit_photo.url)" v-if="data._id.shop_authentication[0].permit_photo" :src="data._id.shop_authentication[0].permit_photo.url+'?x-oss-process=image/resize,m_fixed,h_100,w_100'" mode="widthFix" style="width:200rpx;" ></image>
					</uni-td>
				</uni-tr>
				
				<uni-tr   >
					<uni-th align="center" style="width:200px;"  > 营业执照 </uni-th>
					<uni-td>
						<image  @click="eventImage(data._id.shop_authentication[0].business_license_photo.url)" v-if="data._id.shop_authentication[0].business_license_photo" :src="data._id.shop_authentication[0].business_license_photo.url+'?x-oss-process=image/resize,m_fixed,h_100,w_100'" mode="widthFix" style="width:200rpx;" ></image>
					</uni-td>
				</uni-tr>
			</uni-table>
<!--			*-*-*-*-*-*-*-		商铺营业资质 		*-*-*-*-*-*-*-					-->
			<uni-table  border stripe :emptyText="bankData.length||'暂无更多数据'"  style="border:1px solid #ccc;min-height:200px;margin:50px 0 0 0" >
				<uni-tr>
					<uni-th align="center" >
						银行logo
					</uni-th>
					<uni-th align="center" >
						银行名称
					</uni-th>
					<uni-th align="center" >
						银行卡证号
					</uni-th>
					<uni-th align="center" >
						银行预留手机号码
					</uni-th>
					<uni-th align="center" >
						银行卡类型
					</uni-th>
					<uni-th align="center" >
						开户人姓名
					</uni-th>
					<uni-th align="center" >
						创建日期
					</uni-th>
				</uni-tr>
				<uni-tr v-for="(items,indexs) in bankData" :key="indexs">
					<uni-td align="center">
						<image v-if="items.bank_title" :src="items.bank_title[0].logo" style="width:50px;height:50px;"></image>
					</uni-td>
					<uni-td align="center">
						{{items.bank_title[0].label}}
					</uni-td>
					<uni-td align="center">
						{{items.bank_no}}
					</uni-td>
					<uni-td align="center">
						{{items.bank_tel}}
					</uni-td>
					<uni-td align="center">
						{{
							items.bank_type===1?'个人':'企业'
						}}
					</uni-td>
					<uni-td align="center">
						{{items.name}}
					</uni-td>
					<uni-td align="center">
						<uni-dateformat :date="items.create_date" ></uni-dateformat>
					</uni-td>
				</uni-tr>
			</uni-table>
			<button type="" class="uni-button" style="width:230px;margin:50px auto" @click="urlBack">返回</button>	
		</view>
	</view>
</template>
<script>
	

	const global = uniCloud.importObject("global",{customUI:true})
	const db = uniCloud.database()
	import Util from "@/js_sdk/validator/util.js"
	export default {
		data() {
			return {
				loading:false,//加载中
				// 面包屑
				routes: [
					{to: "/pages/index/index",name: "首页",},
					{to: "/pages/shop/shop/shop-info",name: "商铺信息",},
					{to: "",name: "商铺详情",},
				],
				categirster:'',
				bankData:[],
				data:{
					logo:{},
					_id:{
						shop_authentication:[
							{
								permit_photo:'',
								business_license_photo:'',
								legal_person_card_photo_z:'',
								legal_person_card_photo_f:''
							}
						]
					},
					create_uid:[
						{
							register_env:{}
						}
					]
				}
			}
		},
		onLoad(e) {
			this.usersId = e.shop_id
		},
		mounted(){
			this.getShop()
			this.getBank()
		},
		methods: {
			// 获取店铺数据
			getShop(){
				let shopField = "_id,goods,delivery_price,start_delivery_price,preferential,categories,disabled_status,business_status,intro,title,logo,address,create_time,money,withdrawable_money,create_uid,categories,money,poiname,business_status,withdrawable_money,tel,create_time,start_business_hours1,end_business_hours1,start_business_hours2,end_business_hours2"
				let userField = "_id,nickname,username,last_login_date,mobile,last_login_ip,register_env"
				let authentcationField = "permit_photo,legal_person_card_photo_f,business_license_photo,legal_person_card_photo_z,business_license_address,business_license_number,legal_person_card,legal_person_card_photo_z,shop_id,user_id,business_license_title,legal_person_name,legal_person_card"
				let shopData = db.collection("shop").field(shopField).getTemp({getOne:true})
				let userData = db.collection("uni-id-users").field(userField).getTemp({getOne:true})
				let authenticationData = db.collection("shop_authentication").field(authentcationField).getTemp({getOne:true})
				db.collection(shopData,userData,authenticationData ).where({"_id._value":this.usersId}).get({getOne:true,customUI:true}).then(res=>{
					// console.log(res.result.data);
					this.data = res.result.data
					this.loading = true
				})
			},
		// 获取银行卡
			getBank(){
				let usersBank = db.collection("users_bank").field( "bank_no,bank_title,_id,name,shop_id,create_date,bank_tel,bank_type").getTemp({getOne:false})
				let bankCards = db.collection("bank_cards").getTemp({getOne:true})
				db.collection(usersBank,bankCards).where({shop_id:this.usersId }).get({getOne:false}).then(res=>{
					this.bankData = res.result.data
					// console.log(this.bankData );
				})
			},
			initalMobile(mobile){
				return Util.formatPhoneNumber(mobile)
			},
			initaCards(number){
				return Util.formatBankCardNumber(number)
			},
			initaTime(num){
				if(num){
					return Util.addColon(num)
				}
			},
			snaYuanIs(result){
				return result ? result : '暂无信息'
			},
			goUrl(Url){
				uni.navigateTo({
					url:Url
				})
			},
			userHasPermission(admin=['']){
				return Util.userHasPermission(admin)
			},
			getCategirster(categories){
				db.collection("opendb-mall-categories").where({_id:categories}).get({getOne:true}).then(res=>{
					this.categirster = res.result.data.name
				})
			},
			// 放大图片
			eventImage(image){
				uni.previewImage({
					urls:[image]
				})
			},
			urlBack(){
				uni.navigateBack(1)
			}
		}
	}
</script>


<style scoped>
	.infortitle{
		color:#cca;
		width: 100px;
	}
	.color{
		color:#ff6600;
		font-weight:bold;
	}
	.detail-button-box button {
		width: 50%;
		margin-left: 25%;
	}

	.detail-button-box {
		width: 100%;
		margin-top: 20px;
	}

	.detail-jujue-content {
		width: 94%;
		margin-left: 3%;
		height: 250px;
		border: 1px solid #eee;
		margin-top: 20px;
		border-radius: 5px;
	}

	.detail-juju-title label:last-child {
		margin-right: 1rem;
	}

	.detail-juju-title label:first-child {
		margin-left: 1rem;
		font-weight: bold;
		color: #666;
	}

	.detail-juju-title label {
		line-height: 3rem;
		height: 3rem;
		font-size: 1rem;
	}

	.detail-juju-title {
		height: 3rem;
		width: 100%;
		border-bottom: 1px solid #efefef;
	}

	.detail-jujue-box {
		width: 700px;
		height: 400px;
		background: #fff;
		border-radius: 5px;
	}

	.detail-bottom-button button {
		margin-right: 20px;
	}

	.detail-bottom-button {
		height: 50px;
		line-height: 50px;
		margin-top: 50px;
		margin-bottom: 50px;
		text-align: center;
		width: 100%;
	}

	.detail-uni-td-weight {
		font-weight: bold;
	}

	.detail-id-card label {
		float: left;
		width: 300px;
		height: 180px;
		border: 1px solid #ccc;
		border-radius: 5px;
		margin-left: 20px;
	}

	.detail-image label {
		float: left;
		width: 70px;
		height: 70px;
		border: 1px solid #ccc;
		margin: 10px;
	}

	.uni-header {
		width: 100%;
	}

	.detail-box {
		width: 100%;
		min-height: 800px;
		background: #fff;
	}

	.detail-content {
		width: 90%;
		min-height: 600px;
		margin-left: 5%;
		margin-top: 20px;
	}
</style>